<html xmlns:th="http://www.thymeleaf.org">
<head>
    <!-- TopJUI框架样式 -->
    <link type="text/css" href="/topjui/css/topjui.core.min.css" rel="stylesheet">
    <link type="text/css" href="/topjui/themes/default/topjui.bluelight.css" rel="stylesheet" id="dynamicTheme"/>
</head>
<script type="text/javascript">
    function checkRules(){
        var rules = [];
        $("input[name='myrule']").each(function(){
            if(true==$(this).prop("checked")){
                rules.push($(this).val());
            }
        })
        $("#rules").val(rules.join(','));
    }
</script>
<form id="customerform" method="post" style="padding-top:10px">
    <input type="hidden" name="id" />
    <table width="100%" align="center">
        <tr>
            <th align="right" width="24%">角色名称</th>
            <td style="padding-left: 2px">
                <input name="name" class="inputp" type="text" data-options="required:true" style="width:210px" readonly="readonly"/>
            </td>
        </tr>
        <tr>
            <td colspan="2">
                &nbsp;
            </td>
        </tr>
    </table>

    <div align="center" style="height:360px; overflow-y:scroll;overflow-x:visible;">
        <input id="rules" type="hidden" name="rules">
        <table width="85%" align="center"  border='1' bordercolor='#ccc'>
            <tr th:each="url:${authrule}" height="25px">
                <td align="left" th:if="${url.check}" style="padding-left: 10px;padding-top: 6px">
                    <input type="checkbox" class="topjui-checkbox" name="myrule" th:value="${url.id}" checked/>
                </td>
                <td align="left" th:unless="${url.check}" style="padding-left: 10px;padding-top: 6px">
                    <input type="checkbox" class="topjui-checkbox" name="myrule" th:value="${url.id}" />
                </td>
                <td th:text="${url.title}"  style="padding-left: 10px"></td>
                <td th:text="${url.name}" style="padding-left: 10px"></td>
            </tr>
        </table>
    </div>
</form>
</html>